<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>新增入库单</title>
    <link rel="stylesheet" href="../../font/cangKu/iconfont.css">
    <link rel="stylesheet" href="../../css/cangKuGuanLi/ruKu_tiaoZhuan.css">
    <link rel="stylesheet" href="../../libs/bootstrap-3.4.1-dist/css/bootstrap.min.css">
    <script src="../../js/jquery-3.1.1.js"></script>  
    <script src="../../libs/bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>
    <script src="../../js/allData.js"></script>
    <script src="../../js/utils.js"></script>
    
  
</head>

<body>
    <div class="container-fluid header">
        <h3>新增入库单</h3>
        <div class="pandian_box">
            <div class="pandian_top">
                <span>单据日期</span>
                <input type="date">
            </div>
            <div class="pandian_bot">
                <span>入库单号</span>
                <input type="number" onfocus="this.placeholder=''" onblur="this.placeholder='512450123'"
                    placeholder="512450123">
            </div>
        </div>
        <div class="beizhu clear">
            <span>备注内容</span>
            <textarea name="" id="" cols="30" rows="10" onfocus="this.placeholder=''"
                onblur="this.placeholder='请输入备注内容'" placeholder="请输入备注内容"></textarea>
        </div>

        <div class="h3_box">
            <h3 class="qicai_h3">器材列表</h3>
        
        </div>
        
        <div class="pandian_box">
            <div class="pandian_top">
                <span>器材名称</span>
                <input type="text" onfocus="this.placeholder=''" onblur="this.placeholder='请输入器材名称'"
                    placeholder="请输入器材名称">
            </div>
            <div class="pandian_bot">
                <span>入库数量</span>
                <input type="text" onfocus="this.placeholder=''" onblur="this.placeholder='+5'" placeholder="+5">
            </div>
        </div>
        <div class="pandian_box">
            <div class="pandian_top">
                <span>单价</span>
                <input type="text" onfocus="this.placeholder=''" onblur="this.placeholder='+5'" placeholder="+5">
            </div>
           <div class="pandian_bot">
                <span>金额:
                    <span id='money'>￥300</span></span>
               
            </div>
            <div>
                <button class="jiaru">加入明细</button>
            </div>
        </div> 

        <table class="table">
            <thead id="thead">
                <tr>
                    <th>序号</th>
                    <th>器材编号</th>
                    <th>器材名称</th>
                    <th>规格型号</th>
                    <th>单位</th>
                    <th>数量</th>
                    <th>单价</th>
                    <th>金额</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody id="tbody">
<tr>
    <td>1</td>
    <td>968827059</td>
    <td>油泵</td>
    <td>s11</td>
    <td>台</td>
    <td>10</td>
    <td>280.00</td>
    <td>2800.00</td>
    <td>
        <span class="iconfont icon-shanchu"></span>
    </td>
</tr>
<tr>
    <td>2</td>
    <td>968827059</td>
    <td>火花塞</td>
    <td>85mm*26mm</td>
    <td>个</td>
    <td>20</td>
    <td>50.00</td>
    <td>1000.00</td>
    <td>
        <span class="iconfont icon-shanchu"></span>
    </td>
</tr>
<tr>
    <td>3</td>
    <td>968827059</td>
    <td>油泵</td>
    <td>s11</td>
    <td>台</td>
    <td>30</td>
    <td>50.00</td>
    <td>1500.00</td>
    <td>
        <span class="iconfont icon-shanchu"></span>
    </td>
</tr>
            </tbody>
        </table>
        <div class="btn_box">
            <div>
            <button class="quxiao">取消</button>
            <button class="tijiao">提交</button>
            </div>
            
        </div>

        <!-- 登录提示弹框 -->
        <div class="modal fade" id="myModals" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title" id="myModalLabel">温馨提示</h4>
                    </div>
                    <div class="modal-body">您还没有登录，请先登录</div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-primary queding">确定</button>
                    </div>
                </div><!-- /.modal-content -->
            </div><!-- /.modal -->
        </div>
    </div>

    <script>
         let user = JSON.parse(sessionStorage.getItem('user'));
            // let userName = document.querySelector('.register_box>span')
            // console.log(user);

            if (user == null) {
                $('#myModals').modal('show')
            } else {
                $('.register_box>span').text(user.username)
            }
            $('.queding').click(function () {
                location.href = '../login.html'
            })


        let guanliData = getData('guanliList')

        let huohua = 0
        let huoList = []
        let you = 0

        function showTable(data) {
            for (let i = 0; i < data.length; i++) {
                if(data[i].name == '油泵'){
                    you++
                }else if(data[i].name == '火花塞'){
                    huohua++
                }
            }
            for (let i = 0; i < data.length; i++) {
                
                for (let j = i + 1; j < data.length; j++) {
                    if (data[i].name == data[j].name) {
                        data.splice(j, 1);
                        j--
                    }

                }

            }
            data[0]['kucun'] = you
            data[1]['kucun'] = huohua
            console.log(data);

            
            // $('#tbody').html('');
            // $.each(data,(index,item) => {
            //     $('#tbody').append(`
            //         <tr>
            //             <td>${index+1}</td>
            //             <td>${item.bianhao}</td>
            //             <td>${item.name}</td>
            //             <td>${item.xinghao}</td>
            //             <td>${item.danwei}</td>
            //             <td>${item.kucun}</td>
            //         </tr>
            //     `)
            // })
        }
        showTable(guanliData)
    </script>
</body>

</body>

</html>